<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:c="http://java.sun.com/jsp/jstl/core"
      xmlns:ui="http://java.sun.com/jsf/facelets">
    <h:head>
        <title>Facelet Title</title>
    </h:head>
    <h:body>
        <ui:composition template="../Master/masters.xhtml">
            <ui:define name="content">
                <script type="text/javascript" src="../Jquery/jquery-1.7.1.min.js"></script>
                <script type="text/javascript" src="../Jquery/jquery-ui-1.8.17.custom.min.js"></script>
                <script type="text/javascript" src="../Jquery/jquery.dataTables.js"></script>
                <script type="text/javascript" src="../Jquery/jquery.easing-1.3.pack.js"></script>
                <script type="text/javascript" src="../Jquery/jquery.mousewheel-3.0.4.pack.js"></script>
                <script type="text/javascript" src="../Jquery/quickpager.jquery.js"></script>

                <script type="text/javascript" src="../Master/resources/scripts/simpla.jquery.configuration.js"></script>
                <script type="text/javascript">
                    // increase the default animation speed to exaggerate the effect
           
          
                    $(document).ready(function() {
                        $("ul.paging").quickPager({ pageSize:10,totalPage:8 });
      
                    });

   
                </script>
                <div class="templatemo_h_line">
                </div>
                <h1>Technology News</h1>
                <div style="height: 15px"></div>
                <ul class="paging">
                    <ui:repeat var="article" value="#{news.articles}">

                        <li><div class="news">
                                <div><h:commandLink action="#{newsDetail.articeleByID(article.articlesId)}">#{article.articlesTitle}</h:commandLink></div>
                                <div class="detail"><h:commandLink action="#{newsDetail.articeleByID(article.articlesId)}"><img src="image/btn_detail_sm.gif"></img></h:commandLink></div>
                            </div>
                            <div class="cleaner"></div></li>
                    </ui:repeat>
                </ul>
            </ui:define>
        </ui:composition>>
    </h:body>
</html>

